import { ref, computed } from 'vue'
import { defineStore } from 'pinia'

export type UserMode = 'simple' | 'professional'
export type Theme = 'light' | 'dark'
export type Language = 'en' | 'zh'

export const useAppStore = defineStore('app', () => {
  // 用户模式
  const userMode = ref<UserMode>('simple')

  // 主题
  const theme = ref<Theme>('light')

  // 语言
  const language = ref<Language>(navigator.language.startsWith('zh') ? 'zh' : 'en')

  // 计算属性
  const isDarkMode = computed(() => theme.value === 'dark')
  const isProfessionalMode = computed(() => userMode.value === 'professional')

  // 方法
  function setUserMode(mode: UserMode) {
    userMode.value = mode
    localStorage.setItem('userMode', mode)
  }

  function setTheme(newTheme: Theme) {
    theme.value = newTheme
    localStorage.setItem('theme', newTheme)
  }

  function setLanguage(lang: Language) {
    language.value = lang
    localStorage.setItem('language', lang)
  }

  function toggleTheme() {
    setTheme(theme.value === 'light' ? 'dark' : 'light')
  }

  function toggleMode() {
    setUserMode(userMode.value === 'simple' ? 'professional' : 'simple')
  }

  // 初始化从localStorage读取设置
  function initializeSettings() {
    const savedMode = localStorage.getItem('userMode') as UserMode
    const savedTheme = localStorage.getItem('theme') as Theme
    const savedLanguage = localStorage.getItem('language') as Language

    if (savedMode) userMode.value = savedMode
    if (savedTheme) theme.value = savedTheme
    if (savedLanguage) language.value = savedLanguage
  }

  return {
    userMode,
    theme,
    language,
    isDarkMode,
    isProfessionalMode,
    setUserMode,
    setTheme,
    setLanguage,
    toggleTheme,
    toggleMode,
    initializeSettings
  }
})
